<template>
  <button><router-link to="/home" active-class="ooo">home</router-link></button>
  <button><router-link to="/about" exact-active-class="ooo">About</router-link></button>
  <button><router-link to="/mime" active-class="ooo">Mime</router-link></button>
  <button><router-link to="/category" active-class="ooo">category</router-link></button>
  <button><router-link to="/home/son" active-class="ooo">/home/son</router-link></button>

  <hr />
  <router-view></router-view>
</template>

<script>
import { onMounted } from 'vue'
import router from './router'
import { CategoryRoute, HomeSonRoute } from './router/addRoute'
export default {
  setup() {
    // 在路由函数外面动态添加路由
    router.addRoute(CategoryRoute)
    // 动态添加二级路由
    router.addRoute('home',HomeSonRoute)

  },
}
</script>

<style scoped>
.ooo {
  background-color: pink;
}
</style>
